<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./index.css">
    <title>Document</title>
</head>
<body>
    <main id="main-body">
        <div id="leftbox">
            <div class="small01">昵称：</div>
            <div class="small01">手机号：</div>
            <div class="small01">邮箱：</div>
            <div class="small01">安全问题：</div>
            <div class="small01">问题答案：</div>
            <div class="small01">婚姻状况：</div>
            <div class="small01">学历：</div>
            <div style="width: 100%;height: 10%;display: flex;flex-direction: column;">
                <p style="font-size: 10px;letter-spacing: 1px;">兴趣爱好：</p>
                <span style="width: 100%;"><input style="width: 15px; height: 15px;" type="checkbox" name="gh" id="ddd"><label for="ddd">音乐</label></span>
            </div>
            <div class="small01">个性签名：</div>
        </div>

        <div id="rightbox">
            <form action="#"><div class="small02">
                <input type="text">
            </div>
            <div class="small02">
                <input type="text">
            </div>
            <div class="small02">
                <input type="text">
            </div>
            <div class="small02">
                <select>
                    <option selected>请选择一个问题</option>
                    <option>您的宠物名字</option>
                    <option>您的母校名称</option>
                    <option>您的第一份工作</option>
                </select>
            </div>
            <div class="small02">
                <input type="text">
            </div>
            <div class="small02">
                <input style="width: 10px;height: 10px;" type="radio" name="sss" id="yihun"><label for="yihun">已婚</label>
                <input style="margin-left: 60px; width: 10px;height: 10px;" type="radio" name="sss" id="weihun"><label for="weihun">未婚</label>
            </div>
            <div class="small02">
                <select>
                    <option selected>请选择</option>
                    <option>高中及以下</option>
                    <option>专科</option>
                    <option>本科</option>
                    <option>硕士及以上</option>
                </select>
            </div>
            <div style="width: 80%;height: 10%;display: flex;justify-content: space-around;align-items: end;">
                <span><input style="width: 15px; height: 15px;" type="checkbox" name="gh" id="eee"><label for="eee">运动</label></span>
                <span><input style="width: 15px; height: 15px;" type="checkbox" name="gh" id="rrr"><label for="rrr">阅读</label></span>
            </div>
            <div style="width: 80%;height: 80px;">
                <textarea></textarea>
            </div>
            <div style="width: 80%;height: 25px;display: flex;align-items: center;">
                <button style="margin-right: 20px;" type="submit">保存</button>
                <button type="reset">清空</button>
            </div></form>
        </div>
    </main>
</body>
</html>